<template>
  <div>
    <el-table :data="tableData"    style="width: 100%">
      <el-table-column  type="index"  label="序号">
      </el-table-column>
      <el-table-column  prop="partId"  label="小节编号">
      </el-table-column>
      <el-table-column   label="小节名称">
        <template slot-scope="scope">
          <el-button  type="text" @click.native="getVideo(scope.$index,scope.row)"  size="medium ">{{scope.row.partIdName}}</el-button>
        </template>
      </el-table-column>
      <el-table-column  prop="partFrequence"   label="访问次数"></el-table-column>
    </el-table>
    <div class="block">
      <el-pagination
      @current-change="handleCurrentChange"
        :current-page.sync="pageIndex"
        :page-size="pageSize"
        layout="prev, pager, next, jumper"
        :total="total">
      </el-pagination>
    </div>
  </div>
</template>

<script>
  import {getPartSectionBySectionId} from '@/axios/api'
  export default {
    data() {
      return {
        pageIndex:1,
        pageSize:2,
        total:50,
        tableData: [],
      }
    },
    methods:{
      getVideo:function(index,row){
        this.$router.push({name:'点播视频',path:'/video',params:{videoId:row.videoId}});
      },
      getPartMsg:function(){
        let para = {
          pageIndex: this.pageIndex,
          sectionId : this.$route.params.sectionId
        };
        // console.log(para);
        getPartSectionBySectionId(para).then(res => {
          this.pageSize = res.resData.pageSize;
          this.total = res.resData.total;
          this.tableData = res.resData.list;
        })
      },
      handleCurrentChange(val) {
        this.pageIndex = val;
        this.getPartMsg();
        // alert(`当前页: ${val}`);
      }
    },
    mounted(){
      this.getPartMsg();
    }
  }
</script>
